<template>
	<view class="content">
		<scroll-view scroll-y>
		<view class="header-index">
			<img src="../../static/img/logo-JZ.png" alt="">
		</view>
		</scroll-view>
		<view class="pages">
			<view :class="tabValue=='找成果'?'button':'button buttonbg'" @click="changeTab('找成果')">
				找成果
			</view>
			<view class="center-icon">
				<img src="../../static/img/changeIcon.png" alt="">
			</view>
			<view  :class="tabValue=='找需求'?'button':'button buttonbg'"  @click="changeTab('找需求')">
				找需求
			</view>
			<view class="dialogue">
				<img class="logo-img" src="../../static/img/centertab.png" alt="">
				<view class="dialogue-view">
					<Achievement :keyboardHeight="keyboardHeight"  v-if="tabValue=='找成果'"></Achievement>
					<Conversion :keyboardHeight="keyboardHeight" v-if="tabValue=='找需求'"></Conversion>
				</view>
			</view>
		</view>
		
	</view>

</template>

<script>
	import Achievement from '@/components/chat/Achievement.vue' //成果
	import Conversion from '@/components/chat/Conversion.vue' //需求
	export default {
		components: {
		  Achievement, //成果
		  Conversion //需求
		},
		data() {
			return {
				 keyboardHeight: "",
				 keyboardB: 0,
				 tabValue:'找成果'
			}

		},

		computed: {

		},

		created() {

		},
		mounted(){
			try {
			  var value = wx.getStorageSync('userinfo');
			  console.log(value); // 输出：value
			  if(!value){
				  uni.reLaunch({
				  	url: '/pages/login/login'
				  })
			  }
			} catch (e) {
			  // 处理错误
			  console.log('获取数据失败');
			  uni.reLaunch({
			  	url: '/pages/login/login'
			  })
			}
		},
		onLoad() {
		    // 监听键盘高度变化
		    uni.onKeyboardHeightChange(res => {
				console.log(res)
		      if (res.height > 0) {
				  let that=this;
				  uni.getSystemInfo({
				    success: function (info) {
				      if (info.platform == 'ios') {
				        console.log('当前设备是iOS');
						that.keyboardHeight = res.height-78;
						that.keyboardB = 10;
				        // 在这里执行针对iOS的代码
				      } else {
				        console.log('当前设备不是iOS');
						that.keyboardHeight = res.height-67;
						that.keyboardB = 10;
				      }
				    }
				  });
		        // 键盘弹起时，调整页面布局
		        // this.keyboardHeight = res.height-78;
				
		      } else {
		        // 键盘收起时，恢复原状
		        this.keyboardHeight = 0;
				this.keyboardB = 0;
		      }
		    });
		  },
		methods: {
			changeTab(e){
				console.log(e)
				this.tabValue=e;
			}
		}
	};
</script>
<style>
	/* page{
		height: 100vh;
		overflow: hidden;
	} */
</style>
<style scoped lang="scss">
	uni-page-body,
	uni-page-refresh{
		height: 100%;
		overflow: hidden;
	}

	.content {
		padding-top: 120px;
		background-color: #F1F6FA;
		background-image: url(../../static/img/my-bg.png);
		background-repeat: no-repeat;
		background-size: 100% auto;
		// height: calc(100vh - 50px);
		height: calc(100vh - 120px);
		font-size: 28rpx;
		color: #333333;

		.header-index{
			padding-top: 115rpx;
			width: 100%;
			position: fixed;
			background-color: #F1F6FA;
			background-image: url(../../static/img/my-bg.png);
			background-repeat: no-repeat;
			background-size: 100% auto;
			top: 0;
			height: 50px;
			z-index: 999;
			img{
				top: 90%;
				left: 50%;
				position: absolute;
				width: 130rpx;
				height: 70rpx;
				transform: translate(-50%, -100%);
			}
		}
		.pages{
			// height: calc(100% - 58px);
			height: 100%;
			padding: 0 20rpx;
		}
			
		.button{
			display: inline-block;
			width: 38vw;
			height: 80rpx;
			line-height: 80rpx;
			border-radius:40rpx;
			color: #ffffff;
			text-align: center;
			background-color: #1664FF;
			cursor: pointer;
		}
		.buttonbg{
			background-color: #ffffff;
			color: #3D3D3D;
		}
		.center-icon{
			position: relative;
			display: inline-block;
			width: 18vw;
			text-align: center;
			img{
				position: absolute;
				width: 8vw;
				height: 8vw;
				top: 50%;
				left: 50%;
				transform: translate(-50%, -60%);
			}
		}
		.dialogue{
			height: calc(100vh - 198px);
			margin-top: 20rpx;
			padding: 20rpx;
			background: linear-gradient( 180deg, #F9FCFF 0%, rgba(255,255,255,0) 100%);
			border-radius: 5px 5px 5px 5px;
			.logo-img{
				width: 80rpx;
				height: 35rpx;
			}
			.dialogue-view{
				height: calc(100% - 22px);
			}
		}
	}
</style>